<template>

    <div>

        <div style="margin-bottom:15px;">
            <router-link to="/admin/edit_ticket"><el-button type="primary">添加车票</el-button></router-link>
        </div>

        <el-table
            v-loading="loading"
            :data="data"
            style="width: 100%">
            <el-table-column
                label="id"
                width="180">
                <template slot-scope="scope">
                    <span style="margin-left: 10px">{{ scope.row.t_id }}</span>
                </template>
            </el-table-column>

            <el-table-column
                label="车站名称">
                <template slot-scope="scope">
                    <span style="margin-left: 10px">{{ scope.row.t_name }}</span>
                </template>
            </el-table-column>

            <el-table-column
                label="发车地点"
                width="180">
                <template slot-scope="scope">
                    <span style="margin-left: 10px">{{ scope.row.t_start_place.text.join(',') }}</span>
                </template>
            </el-table-column>

            <el-table-column
                label="目的地点"
                width="180">
                <template slot-scope="scope">
                    <span style="margin-left: 10px">{{ scope.row.t_end_place.text.join(',') }}</span>
                </template>
            </el-table-column>

            <el-table-column
                label="发车时间"
                >
                <template slot-scope="scope">
                    <span style="margin-left: 10px">{{ $date.getDateTime(scope.row.t_time*1000) }}</span>
                </template>
            </el-table-column>

            <el-table-column
                label="车票均价"
                width="180">
                <template slot-scope="scope">
                    <span style="margin-left: 10px">{{ scope.row.t_ticket_price }}</span>元
                </template>
            </el-table-column>

            <el-table-column label="操作" width="180">
                <template slot-scope="scope">
                    <router-link :to='"/admin/edit_ticket?id="+scope.row.t_id'>
                        <el-button size="mini">编辑</el-button>
                    </router-link>
                    <el-button size="mini" type="danger" @click="dele(scope.row.t_id)">删除</el-button>
                </template>
            </el-table-column>

        </el-table>

        <el-pagination
        v-if="allpage>1"
        style="margin-top:10px"
        background
        layout="prev, pager, next"
        :total="count"
        :page-size="pagesize"
        @current-change="changePage"
        >
    </el-pagination>

    </div>
    
</template>

<style scoped>

</style>

<script>
export default {

    data(){

        return {

            data: [],
            page: 1,
            count: 0,
            pagesize:10,
            allpage:0,
            loading: false

        }

    },
    methods:{
        getData(){

            this.loading = true

            let that = this

            this.$axios.post('/admin.php/ticket',this.$qs.stringify({page:this.page})).then( (res) => {

                that.loading = false

                if(res.data.code==1){

                    that.data = res.data.data.data

                    that.count = res.data.data.count

                    that.pagesize = res.data.data.pagesize

                    that.allpage = res.data.data.allpage

                    if(res.data.data.page<res.data.data.allpage){

                        that.page = res.data.data.page+1

                    }

                }else{

                    that.$message.error(res.data.msg)

                }

            } ).catch( (err) => {

                 that.loading = false

                that.$message.error('网络繁忙~')

            } )

        },
        changePage(page=1){

            this.page = page

            this.getData()

        },
        dele(id=null){

            let that = this

            this.$confirm('确定要删除该条数据吗？','删除提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then( () => {

                this.$axios.post('/admin.php/ticket/dele',this.$qs.stringify({id:id})).then( (res) => {

                    if(res.data.code==1){

                        that.getData()

                        that.$message({
                            message: '删除成功~',
                            type: 'success'
                        });

                    }else{

                        that.$message.error(res.data.msg)

                    }

                } ).catch( (err) => {

                    that.$message.error('网络繁忙~')

                } )

            } ).catch( () => {} )

            

        }
    },
    created(){
        this.getData()
    }
    
}
</script>